Skip to content

Fix source indices for Sass interpolated selectors#244

Open
p-szm wants to merge 4 commits into
postcss:mainfrom
p-szm:ps/fix-sass-interpolation-indices-2
Open

Fix source indices for Sass interpolated selectors#244
p-szm wants to merge 4 commits into
postcss:mainfrom
p-szm:ps/fix-sass-interpolation-indices-2

Conversation

@p-szm

@p-szm p-szm commented May 2, 2021

Copy link
Copy Markdown

Fixes #243

I had to rewrite most of the splitWords parser method because the previous one didn't use the correct indices when multiple tokens were involved.

t.deepEqual(class2.value, 'is-$(network)');
t.deepEqual(class2.type, 'class');
t.deepEqual(class2.source.start.column, 6);
// t.deepEqual(class2.source.end.column, 19); // Fail - 10

Copy link
Copy Markdown
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This still fails because the splitWords method processes this selector as [".icon", ".is-$"] and there is another place in the code that adds the rest of the selector in (I believe it's the pseudoselector code). I'm not sure how to fix this.

@coveralls

coveralls commented May 2, 2021

Copy link
Copy Markdown

Coverage Status

Coverage decreased (-0.07%) to 95.369% when pulling b4c1b71 on patrickszmucer:ps/fix-sass-interpolation-indices-2 into 54f71ef on postcss:master.

Comment thread src/parser.js
const current = this.currToken;
const sourceIndex = current[TOKEN.START_POS] + indices[i];
const {NodeConstructor, value, startToken, endToken, startIndex, endIndex} = node;
const sourceIndex = startToken[TOKEN.START_POS] + startIndex;

Copy link
Copy Markdown
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This was basically the fix - we're now using startToken and endToken which are correctly computed for each class/id/tag, instead of always using this.currToken

Comment thread src/parser.js
if (current.lastIndexOf('\\') === current.length - 1) {
const token = this.currToken;
tokensList.push(token);
if (this.content(token).endsWith('\\')) {

Copy link
Copy Markdown
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This should be equivalent to current.lastIndexOf('\\') === current.length - 1, apart from the case when current is equal to "". I think we never get empty strings here though, but let me know if I'm wrong.

Copy link
Copy Markdown
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

But also I'm not sure if this condition is ever true. The coverage report says that this if statement never evaluates to true during tests (both in this PR and also on base), and I haven't been able to write a test that hits this.

I tried parsing .#{$classname1}\\$classname2, but it gets tokenized as ["/#{", "$", "classname1}\\$classname2"] and not as ["/#{", "$", "classname1}\\", "$", "classname2"], so maybe the tokenizer handles this already?

@p-szm p-szm marked this pull request as ready for review May 2, 2021 23:44
@p-szm

p-szm commented Sep 27, 2021

Copy link
Copy Markdown
Author

@alexander-akait is this something you would consider merging, or should we close this out?

@MoOx

MoOx commented Jun 9, 2026

Copy link
Copy Markdown
Collaborator

Please update the PR if this is still relevant.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Wrong source and sourceIndex for Sass interpolated selectors

3 participants